body {
	font-family: Arial, sans-serif;
}

header {
	background-color: #333;
	color: white;
	padding: 10px 0;
	text-align: center;
}

nav button {
	margin: 5px;
	padding: 10px;
	background-color: #444;
	color: white;
	border: none;
	cursor: pointer;
}

nav .active {
	background-color: #555;
}
/* table */
main {
	max-width: 1000px;

	margin: 20px auto;
	background-color: white;
	padding: 20px;
	border-radius: 10px;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.tb_container h2 {
	text-align: center;
	color: #333;
}

.search_box {
	display: flex;
	justify-content: flex-end;
	margin-bottom: 20px;
}

.search_box input[type="text"] {
	padding: 10px;
	width: 300px;
	border: 1px solid #ccc;
	border-radius: 5px;
	font-size: 14px;
}

.table_main {
	width: 100%;
	border-collapse: collapse;
	table-layout: auto;
}

.table_main thead {
	background-color: #007bff;
	color: white;
}

.table_main th,
.table_main td {
	padding: 12px 15px;
	text-align: left;
	border-bottom: 1px solid #ddd;
}
.table_main td span{
    cursor: pointer;
    margin: 0 5px;
}
.table_main tbody tr:hover {
	background-color: #f1f1f1;
}

@media (max-width: 600px) {
	.table_main,
	.table_main thead,
	.table_main tbody,
	.table_main th,
	.table_main td,
	.table_main tr {
		display: block;
	}

	.table_main th {
		position: sticky;
		top: 0;
		background-color: #007bff;
		color: white;
	}

	.table_main td {
		position: relative;
		padding-left: 50%;
		text-align: right;
	}

	.table_main td::before {
		content: attr(data-label);
		position: absolute;
		left: 15px;
		font-weight: bold;
		color: #555;
	}
}

.div_in_container {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-around;
	margin: 0;
	padding: 10px;
	width: 100%;
}
.div_input_son_container {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.div_input_son_container h3 {
	margin: 5px;
}
.div_input_son_container button {
	margin: 5px;
	width: 300px;
	background-color: #2db323;
	cursor: pointer;
	height: 40px;
	color: white;
	border: 0px;
	border-radius: 5px;
}
.div_input_son_container button:hover {
	background-color: #2db323a7;
}
.div_input_son_container input {
	width: 290px;
    margin: 5px;
    height: 30px;
	border: 1px solid #ccc;
	border-radius: 5px;
	font-size: 14px;
}
